<template>
	<view class="">
		<view class="top">
			<u-tabs :list="list" lineWidth='60' activeStyle='color:#D34200' lineColor='#D34200' lineHeight='6' @click="click"></u-tabs>
		</view>
<!--		<view class="screen disp aic" v-if="select==2&&userType==2">-->
<!--			<text>条件筛选：</text>-->
<!--			<view class="select fl1" @click="show=true">-->
<!--				<text>{{screen}}</text>-->
<!--				<image class="down" src="../../static/images/search/down.png" mode=""></image>-->
<!--			</view>-->
<!--		</view>-->
		<view class="wrapper">
			<view class="list" v-for="item in customList" :key="item.orderId"  @click="goDetail(item.orderId)">
				<view class="top disb aic">
					<view class="fz12">订单编号：{{item.orderId}}</view>
					<view class="color disp aic">
						<view class="status"></view>
						<view>{{item.orderStatusZh}}</view>
					</view>
				</view>
				<view class="content disc jsb">
					<view class="disb fw">
						<view class="fl1">
							<text class="o-font-type">申请人：</text>
							<text>{{item.name}}</text>
						</view>
						<view class="fl1">
							<text>预估额度：</text>
							<text class="color">￥{{item.amount?item.amount:0}}</text>
						</view>
					</view>
					<view class="o-font-size-b">
						<text>名称：</text>
						<text>{{item.productName}}</text>
					</view>
					<view class="o-font-size-b">
						<text>派单时间：</text>
						<text>{{getTime(item.createTime)}}</text>
					</view>

          <view class="o-font-size-b">
            <text>当前流程：</text>
            <text class="color">{{item.orderFlowZh}}</text>
          </view>


          <view class="o-font-size-b">
            <text>审核状态：</text>
            <text class="color" v-if="item.applyState!='3'">{{item.causeOfFailure?item.causeOfFailure:'待审核'}}</text>
            <text class="color" v-if="item.applyState=='3'">审核成功</text>
          </view>

					<view class="o-font-size-b">
						<text>实际放款金额：</text>
            <span style="float: right;position: absolute;">
               <u--text mode="price" :text="item.practicalAmount" size="16" color="#D34200" bold="true"></u--text>
            </span>
					</view>

<!--					<view class="say o-font-size-b" v-if="item.causeOfFailure">{{item.causeOfFailure}}</view>-->
				</view>
				<view class="more tac fz12 color6">查看更多>>></view>
			</view>
		</view>
		<u-picker :show="show" :immediateChange="true" :columns="columns" @confirm='confirm' @cancel='show=false'></u-picker>
		<tabbar :current="2" :tabBarList="tabBerLists"></tabbar>
	</view>
</template>

<script>
	import {getCustomerList,getWarrantList} from "../../api/search.js"
	import tabbar from "../../components/tabbar/tabbar.vue"
export default {
	components: {
		  tabbar
	},
	data() {
		return {
			userType:uni.getStorageSync('userInfo').userType,
			tabBerLists:[],
			screen:'资料完善中',
			show:false,
			select:1,
			type:1,
			columns: [
				['资料审核失败', '资料完善中']
			],
			list:[
				{name: '待跟进'},
				{name: '跟进中'},
				{name: '已完成'},
			],
			customList:[]
		}
	},
	onShow() {
		this.getList()
		this.tabBerLists = uni.getStorageSync('tabBarList') // 自定义的tabbar赋值
	},
	methods: {
		click(e){
			this.type = 1
			this.select = e.index + 1
			this.getList()
		},
		confirm(e){
			this.show = false
			this.screen = e.value[0]
			this.type = e.indexs[0]
			this.getList()
		},
		goDetail(id){
			uni.navigateTo({
				url:`/pages/search/orderDetail?id=${id}`
			})
		},
		//获取客户列表
		getList(){
			if(this.userType==2){
				getCustomerList({status:this.select,type:this.type}).then(res => {
					this.customList = res.data
				})
			}else if (this.userType==3){
				getWarrantList({status:this.select}).then(res => {
					this.customList = res.data
				})
			}
		},
		//时间戳转换
		getTime(time){
			let data= new Date(time);
			let year = data.getFullYear();
			let month = data.getMonth() + 1;
			let day = data.getDate();
			let h = data.getHours();
			let mm = data.getMinutes();
			let s = data.getSeconds();
			month = month >= 10 ? month : "0" + month;
			day = day >= 10 ? day : "0" + day;
			h = h >= 10 ? h : "0" + h;
			mm = mm >= 10 ? mm : "0" + mm;
			s = s >= 10 ? s : "0" + s;
			return `${year}-${month}-${day} ${h}:${mm}:${s}`;
		},
	}
}
</script>

<style lang="scss" scoped>
.top{
	padding: 20rpx;
	/deep/ .data-v-48634e29{
		text-align: center;
		flex: 1;
	}
}
.screen{
	padding: 30rpx 40rpx;
	.select{
		padding: 10rpx;
		border: 1rpx solid #d5d5d5;
		border-radius: 10rpx;
		position: relative;
		.down{
			width: 30rpx;
			height: 30rpx;
			position: absolute;
			right: 15rpx;
			bottom: 15rpx;
		}
	}
}
.wrapper{
	padding: 20rpx 40rpx;
	.list{
		margin: 20rpx 0;
		box-shadow: 0 0 6rpx #ccc;
		.top{
			padding: 20rpx;
			background-color: #EAEAEA;
			.status{
				width: 10rpx;
				height: 10rpx;
				border-radius: 50%;
				margin-right: 10rpx;
				background-color: #D34200;
			}
		}
		.content{
			min-height: 120rpx;
			padding: 30rpx 20rpx;
			border-bottom: 1rpx dashed #888888;
			.say{
				padding: 10rpx 20rpx;
				background-color: #dcdcdc;
			}
		}
		.more{
			padding: 20rpx;
		}
	}
}
</style>
